<template>
  <div class="rankings">
    <a-card title="签到" bordered={false} class="sidebar-card">
      <p>这里是签到内容</p>
    </a-card>
    <a-card title="文章热度榜" bordered={false} class="sidebar-card">
      <p>这里是文章热度榜内容</p>
    </a-card>
    <a-card title="作者榜" bordered={false} class="sidebar-card">
      <p>这里是作者榜内容</p>
    </a-card>
  </div>
</template>

<script setup>
</script>

<style scoped>
.rankings {
  //background: #ffffff; /* 右侧区域背景 */
  display: flex;
  flex-direction: column; /* Stack cards vertically */
  gap: 16px; /* Space between cards */
}

.sidebar-card {
  /* Optional: You can add styles here for individual cards if needed */
}
</style>
